import $ from 'jquery'
import eleData from './RichElement.js'
import { v4 as uuidv4 } from 'uuid'

const operatorMethod = {
	range: null,
	createElement(parent, ele, isStyle = true) {
		let el = $(ele.tag);
		if (isStyle) {
			$(el).append($("<br/>"));
			$(el).attr("style", ele.style);
			$(el).attr("tag", ele.id);
		}
		$(el).attr("dataId", uuidv4().replaceAll(/-/g, ''));
		$(parent).append(el);
		return el.get(0);
	},
	createElementNoParent(ele) {
		let el = $(ele.tag);
		$(el).attr("style", ele.style);
		$(el).attr("tag", ele.id);
		$(el).append($("<br/>"));
		$(el).attr("dataId", uuidv4().replaceAll(/-/g, ''));
		return el.get(0);
	},
	createELementChinase(pin, content) {
		let chinaseWord = operatorMethod.createElementNoParent(eleData.chineseWord);
		$(chinaseWord).empty();
		let word = $(eleData.chineseWord.word).get(0);
		chinaseWord.append(word);
		$(word).append(pin);
		$(word).append(content);
		operatorMethod.insertDom(chinaseWord)
	},
	createElementChildren(ele) {
		let el = $(ele.childrenTag);
		$(el).append($("<br/>"));
		$(el).attr("dataId", uuidv4().replaceAll(/-/g, ''));
		return el.get(0);
	},
	updateElementStyle(tag, ele) {
		$(tag).attr("style", ele.style);
		$(tag).attr("tag", ele.id);
	},
	createElementImg(ele, data) {
		let el = $(ele.tag);
		$(el).attr("style", ele.style);
		$(el).attr("src", data);
		$(el).attr("dataId", uuidv4().replaceAll(/-/g, ''));
		let b = $("<p>");
		b.attr("tag", ele.id)
		b.attr("style", eleData.content.style);
		b.append(el);
		return b.get(0);
	},
	getElements(range) {
	  let elements = [];
	  let children = range.commonAncestorContainer.childNodes;
	  if (range.startContainer.data) {
	    let start = range.startContainer.parentElement;
	    let end = range.endContainer.parentElement;
	    let next = start;
	    elements.push(start)
	    while(start != end) {
	      next = next.nextSibling;
	      if (!next) {
	        break;
	      }
	      if (next == end) {
	        elements.push(next);
	        break;
	      }
	      elements.push(next);
	    }
	  } else {
	    elements.push(range.startContainer)
	  }
	  return elements;
	},
	updateRange(el) {
		let range = document.createRange();
		range.selectNodeContents(el);
		range.collapse(false);
		let sel = window.getSelection();
		sel.removeAllRanges();
		sel.addRange(range);
	},
	getSelectNode() {
		let seat = this.range ? this.range : window.getSelection().getRangeAt(0);
		let n = null;
		// debugger;
		if(seat.endContainer.nodeName.toLowerCase() == 'text' || seat.endContainer.nodeName.toLowerCase() == '#text') {
			n = seat.endContainer.parentNode
		} else {
			n = seat.endContainer;
		}
		return n;
	},
	getSelectedNode(range) {
		let n = null;
		// debugger;
		if(range.endContainer.nodeName.toLowerCase() == 'text' || range.endContainer.nodeName.toLowerCase() == '#text') {
			n = range.endContainer.parentNode
		} else {
			n = range.endContainer;
		}
		if ($(n).attr("tag") == eleData.chineseWord.pingyinId || $(n).attr("tag") == eleData.chineseWord.contentId) {
			n = $(n).parent().parent();
		} else if ($(n).attr("tag") == eleData.chineseWord.wordId) {
			n = $(n).parent();
		}
		return n;
	},
	insertNode(str, ele, isImage=false, isHtml = false) {
		let node = null;
		if (!isImage) {
			node = operatorMethod.createElementNoParent(ele);
			if (isHtml) {
				$(node).html(str);
			} else {
				$(node).text(str);
			}
			
		} else {
			node = operatorMethod.createElementImg(ele, str);
		}
		let n = operatorMethod.getSelectNode();
		// debugger;
		if (n.nodeName.toLowerCase() == "div") {
			$(n).append(node);
		} else {
			$(n).after(node);
		}
		operatorMethod.updateRange(node);
		return node;
	},
	insertDom(dom) {
		let n = operatorMethod.getSelectNode();
		// debugger;
		if (n.nodeName.toLowerCase() == "div") {
			$(n).append(dom);
		} else {
			$(n).after(dom);
		}
		operatorMethod.updateRange(dom);
	},
	insertCommonNode(ele, parent = false, times = 1) {
		let node = operatorMethod.createElementNoParent(ele);
		let n = operatorMethod.getSelectNode();
		// debugger;
		if (n.nodeName.toLowerCase() == "div") {
			$(n).append(node);
		} else {
			if (parent) {
				let part = $(n).parent();
				for (let i = 1; i < times; i ++) {
					part = $(part).parent();
				}
				$(part).after(node);
			} else {
				$(n).after(node);
			}
			
		}
		operatorMethod.updateRange(node);
	},
	insertCode(ele, content, isParent = false) {
		let node = operatorMethod.createElementChildren(ele);
		$(node).html(content);
		let n = operatorMethod.getSelectNode();
		if ($(n).attr("tag") == ele.id) {
			$(n).append(node);
		} else {
			if (!isParent) {
				$(n).after(node);
			} else {
				$(n).parent().after(node);
			}
			
		}
		operatorMethod.updateRange(node);
	},
	insertCodeWindow(ele) {
		let node = operatorMethod.createElementNoParent(ele);
		let n = operatorMethod.getSelectNode();
		if ($(n).attr("tag") == ele.id) {
			$(n).append(node);
		} else {
			$(n).after(node);
		}
		operatorMethod.updateRange(node);
	},
	insertOlWdinwo(ele, content, select=null) {
		let node = operatorMethod.createElementNoParent(eleData.content);
		$(node).empty();
		$(node).attr("tag", ele.id);
		let ol = operatorMethod.createElement(node, ele, false);
		let li = operatorMethod.createElementChildren(ele);
		$(ol).append(li);
		$(li).text(content);
		let n = select == null ? operatorMethod.getSelectNode() : select;
		if ($(n).attr("tag") == ele.id) {
			$(n).append(node);
		} else {
			$(n).after(node);
		}
		operatorMethod.updateRange(li);
	},
	insertContent(text) {
		let selection = window.getSelection();
		let range = selection.getRangeAt(0);
		range.deleteContents();
		var textNode = document.createTextNode(text);
		range.insertNode(textNode);
		selection.collapse(textNode, textNode.length);
	},
	createCodeItem(n, content='', isHtml=false) {
		let codeItem = $(eleData.code.childrenTag);
		if (isHtml) {
			$(codeItem).html(content)
		} else {
			$(codeItem).text(content);
		}
		
		// $(codeItem).append($("<br/>"))
		 if ($(n).attr("tag") == 'codeChildren') {
			 $(n).after(codeItem);
			 operatorMethod.updateRange(codeItem[0]);
		 } else if ($(n).attr("tag") == 'body') {
			 $(n).append(codeItem);
			 operatorMethod.updateRange(codeItem[0]);
		 } else {
			 let children = $(n).children();
			 for(let i = 0; i < children.length; i++) {
				 if ($(children[i]).attr("tag") == 'body') {
					 $(children[i]).append(codeItem);
					 operatorMethod.updateRange(codeItem[0]);
					 return codeItem;
				 }
			 }
		 }
		return codeItem;
	},
	createCodeToContent(n) {
		let content = operatorMethod.createElementNoParent(eleData.content);
		if ($(n).attr("tag") == 'codeChildren') {
			$(n).parent().parent().after(content)
		} else if ($(n).attr("tag") == 'body') {
			$(n).parent().after(content)
		} else {
			$(n).after(content);
		}
		operatorMethod.updateRange(content);
	}
}

export default operatorMethod;